* {
    margin: 0px;
    padding: 0px;
}

body {
    font-family:  Arial, Verdana, Helvetica, sans-serif;
    font-size: 18px;
}

div#header {
    margin-bottom: 2%;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-color: black;
}

div#customers {
    width: 43%;
    margin-left: 1%;
    margin-right: 4%;
    border: 1px solid #165A16;
    text-align: center;
    float: left;
}

div#products {
    width: 16%;
    border-style: solid;
    border-width: 1px;
    border-color: #165A16;
    float: left;
}

div#transaction {
    width: 30%;
    margin-left: 4%;
    margin-right: 1%;
    border-style: solid;
    border-width: 1px;
    border-color: #165A16;
    float: left;
}

div #customerInfo {
    text-align: center;
}

div #transactionButtons {
    text-align: right;
}

p.title {
    background-color: #165A16;
    color: white;
    font-weight: bold;
    text-align: center;
}

p.subtitle {
    border-top: 1px solid #165A16;
    border-bottom: 1px solid #165A16;
    margin-top: 1%;
    margin-bottom: 1%;
    padding-left: 2%;
    font-weight: bold;
    font-style: italic;
}

#customers input {
    border-style: solid;
    border-color: #165A16;
    border-width: 1px;
    width: 90%;
    margin-top: 2%;
    margin-bottom: 2%;
}

#customers input:focus {
    border-width: 2px;
}

table {
    width: 100%;
    border-collapse: collapse;
}

td {
    text-align: justify;
    padding: 1%;
}

tr.clickable:hover {
    cursor: pointer;
    background-color: #D7D7D7;
}
